<nav class="p-1 text-sm bg-secondary-lighter rounded-lg shadow-md">
  <ul class="nav-pill relative flex bg-secondary-lighter rounded-lg">
    <li class="nav-pill-item z-1 box-border w-24 px-4 py-1 text-center rounded-lg cursor-pointer">Home</li>
    <li class="nav-pill-item z-1 box-border w-24 px-4 py-1 text-center rounded-lg cursor-pointer">Services</li>
    <li class="nav-pill-item z-1 box-border w-24 px-4 py-1 text-center rounded-lg cursor-pointer">About</li>
    <li class="nav-pill-indicator absolute z-0 w-24 h-full box-border px-4 py-1 text-transparent bg-primary rounded-lg cursor-pointer duration-300"></li>
  </ul>
</nav>